<template>
  <div>
    <header>周末去哪玩儿</header>
    <ol class="list-weekend">
      <li v-for="item of weekendList" :key="item.id">
        <a href=""
          ><img :src="item.imgUrl" alt="" />
          <h4>{{ item.title }}</h4>
          <p>{{ item.desc }}</p>
        </a>
      </li>
    </ol>
  </div>
</template>

<script>
export default {
  name: 'Weekend',
  props: ['weekendList'],
  data() {
    return {}
  },
}
</script>

<style lang="scss" scoped>
header {
  line-height: 0.8rem;
  background: #eee;
  padding-left: 0.2rem;
}
.list-weekend {
  li {
    margin-bottom: 0.15rem;
  }
  h4 {
    font-size: 0.32rem;
    color: $fg;
    padding-left: 0.1rem;
  }
  p {
    color: #ccc;
    padding-left: 0.1rem;
  }
}
</style>
